//LiuZh 2017-06-22
import React, {Component} from 'react';

import {
    StyleSheet,
    View,
    Image,
    Text,
    ScrollView,
    TouchableOpacity,
    Modal,
    Dimensions
} from 'react-native';

import HomeSettingsGroup from '../component/comp.home-settings-group';
import InitDB from '../../core/database/init-db';

let winWidth = Dimensions.get('window').width;//屏幕宽度
let imgHead = require('../../img/self_zhaoliying.png');
let imgBg = require('../../img/bg_user.png');

export default class UserScene extends Component {

    static navigationOptions = {
        tabBarLabel: '个人中心',
    };

    constructor(props) {
        super(props);
        this.state = {};
    }

    componentDidMount() {

    }

    updateUserInfo() {
        //alert('aa');
        this.props.screenProps.appNavigation.navigate('UserInfo', {
            mobile: InitDB.getCurrentUser().username,
            type: 'update'
        });
    }

    render() {
        return (
            <ScrollView
                showsVerticalScrollIndicator={false}>
                <View style={styles.body}>
                    <View style={styles.topBody}>
                        <Image style={styles.topBg} source={imgBg}/>
                        <TouchableOpacity activeOpacity={0.9} style={styles.headTouch} onPress={this.updateUserInfo.bind(this)}>
                            <Image style={styles.headPic} source={imgHead}/>
                        </TouchableOpacity>
                        <Text style={styles.nicname}>{InitDB.getCurrentUser().username}</Text>
                        <View style={styles.dataBody}></View>
                    </View>
                    <HomeSettingsGroup navigation={this.props.screenProps.appNavigation}/>
                </View>
            </ScrollView>
        );
    }
}

const styles = StyleSheet.create({
    body: {
        flex: 1,
        backgroundColor: '#EFEFEF',
    },
    topBody: {
        backgroundColor: '#FFF'
    },
    topBg: {
        width: winWidth,
        height: 387 / 750 * winWidth,
    },
    headTouch: {
        marginTop: -25.5,
    },
    headPic: {
        width: 60,
        height: 60,
        alignSelf: 'center',
        borderRadius: 60,
        borderColor: '#FFF',
        borderWidth: 1.3,
    },
    nicname: {
        color: '#333',
        marginTop: 3,
        fontSize: 14,
        marginBottom: 8,
        alignSelf: 'center',
    },
    dataBody: {
        flex: 1,
        alignItems: 'center',
        flexDirection: 'row',
        justifyContent: 'center'
    },
    dataEnter: {
        right: 5,
        alignSelf: 'center',
        position: 'absolute',
    },
});


